<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script src="https://cdn.bootcss.com/vue/2.6.10/vue.js"></script>
</head>
<body>
    <div id="app">
        <ul>
<!--
（shuju,index）这是代表我们期望遍历的时候既获取数据，又获取下标
:key="index" 声明在前面的括号中哪个名字是下标，vue就会将下标设置给对应的变量
-->
            <li v-for="(shuju,index) in aihao" :key="index">index:{{index}}，{{shuju}}</li>
        </ul>
    </div>

</body>
<script>
    new Vue({
        el: "#app",
        data: {
            aihao: ['刘一','张三','李四','王五']
        },
        methods: {
            dizhi: function () {
                return "北京市清华路"
            }
        }
    });
</script>
</html>